/* eslint-disable */
import React, { PureComponent } from 'react';
import { Input } from 'antd';

class MobileQueryInput extends PureComponent {
  state = {
    value: '',
  };

  componentWillMount() {
    const { value } = this.props;
    if (value) this.setState({ value });
  }

  componentWillReceiveProps(nextProps) {
    const { props } = this;
    if (props.value !== nextProps.value) {
      this.setState({ value: nextProps.value });
    }
  }

  render() {
    const { onChange } = this.props;
    const { value } = this.state;
    return (
      <Input
        placeholder="请输入手机号"
        {...this.props}
        value={value}
        onChange={e => {
          let { value } = e.target;
          if (value) {
            const regex = /[^0-9]/g;
            if (regex.test(value)) {
              value = value.replace(regex, '');
              this.setState({ value });
              return;
            }
            if (value.length > 11) {
              value = value.substring(0, 11);
              this.setState({ value });
              return;
            }
          }
          if (onChange) onChange(value);
        }}
      />
    );
  }
}

export default MobileQueryInput;
